package com.study.compose.beta.view

import androidx.compose.foundation.Image
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import com.module.compose.base.composable.Title
import com.module.compose.base.composable.imageLoader.gifImageLoader
import com.module.compose.base.composable.imageLoader.rememberCoilPainter
import com.study.compose.beta.R

/**
 * 作者：zhangjunfei 2021/6/1 1:43 下午
 * 主页：https://gitee.com/ZhangQQ_123/projects
 * 描述：image示例
 */

@Composable
fun ImageSample() {
    LazyColumn(
        Modifier
            .fillMaxSize()
            .padding(start = 15.dp, end = 15.dp)
    ) {
        item {
            Column(Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) {
                Title(title = "加载资源图片")
                Image(
                    painter = painterResource(id = R.mipmap.icon_launcher),
                    contentDescription = "加载图片"
                )
            }
        }

        item {
            Column(Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) {
                Title(title = "对图片进行修饰")
                Image(
                    painter = painterResource(id = R.mipmap.icon_launcher),
                    contentDescription = "加载图片",
                    Modifier
                        .height(80.dp)
                        .width(80.dp)
                        .alpha(200f)
                        .clip(shape = RoundedCornerShape(50))
                        .border(width = 2.dp, color = Color.Red, shape = RoundedCornerShape(50))
                )
            }
        }
        item {
            Column(Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) {
                Title(title = "加载网络GIF图片")
                Image(
                    painter = rememberCoilPainter(
                        request = "https://gitee.com/ZhangQQ_123/GesturePasswordSample/raw/master/pic/1602211793384.gif",
                        imageLoader = gifImageLoader(
                            LocalContext.current
                        ),
                    ),
                    contentDescription = null
                )
            }
        }

        item {
            Column(Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) {
                Title(title = "加载网络图片")
                Image(
                    painter = rememberCoilPainter(
                        request = "https://picsum.photos/seed/picsum/600/600",
                        requestBuilder = {
                            placeholder(R.mipmap.icon_launcher)
                        },
                        fadeIn = true
                    ),
                    contentDescription = null,
                    Modifier
                        .width(100.dp)
                        .height(100.dp)
                )
            }
        }

        item {
            Spacer(modifier = Modifier.height(50.dp))
        }
    }
}